<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>确认订单信息</title>
    <link rel="shortcut icon" href="logo.ico">
    <link rel="stylesheet" href="css/order.css">
    <link rel="stylesheet" href="libs/bootstrap/css/bootstrap.css">
    <link rel="stylesheet" href="fonts/iconfont.css">
    <script src="libs/jquery.min.js"></script>
    <script src="libs/bootstrap/js/bootstrap.bundle.js"></script>
    <script src="js/address.js"></script>
</head>

<body onload='getProvince()'>
    <!-- 头部开始 -->
    <div class="header">
        <div class="d-flex container justify-content-between">
            <div class="header-nav-left">
                <a href="index.html">
                    <i class="iconfont icon-shouye"></i>
                    环球鞋网首页
                </a>
            </div>
            <div class="header-nav-right d-flex">
                <div class="nav-item">你好，
                    <a href="#">ikun</a>
                    &nbsp
                    <a href="#">
                        <i class="iconfont icon-tuichu"></i>
                        退出
                    </a>
                </div>
                <div class="nav-spacer"></div>
                <a href="car.html" class="nav-item">我的购物车</a>
                <div class="nav-spacer"></div>
                <a href="information.html" class="nav-item">个人中心</a>
                <div class="nav-spacer"></div>
                <a href="#" class="nav-item">帮助中心</a>
            </div>
        </div>
    </div>
    <!-- 头部结束 -->
    <!-- 头部2开始 -->
    <div class="header-two my-3">
        <div class="container d-flex justify-content-between">
            <div class="login-left">
                <img src="images/logo.png" alt="logo">
            </div>
            <div class="schedule-box">
                <ul class="schedule-list">
                    <li class="schedule-list1">
                        <span class="schedule-list-active2"></span>
                        <span class="schedule-font">我的购物车</span>
                    </li>
                    <li class="schedule-list2">
                        <span class="schedule-list-active auto"></span>
                        <span class="schedule-font">确认订单信息</span>
                    </li>
                    <li class="schedule-list3">
                        <span class="schedule-list-active2 fl-r"></span>
                        <span class="schedule-font">付款，完成购买</span>
                    </li>
                </ul>
            </div>
        </div>
    </div>
    <!--路径导航开始-->
    <div id="navPath" class="container">
        <p>
            您当前的位置 :&nbsp&nbsp&nbsp
            <a href="index.html">首页</a>
        </p>
        <i>/</i>
        <a>确认订单信息</a>
    </div>
    <!--路径导航结束-->
    <!-- 版心元素开始 -->
    <div class="container px-0 d-flex justify-content-center align-content-center">
        <h4>填写并核实订单信息</h4>
    </div>
    <div class="container px-0 order-mainContent">
        <div class="order-step container">
            <div class="order-step-tit mt-2 mb-4">收货人信息</div>
            <form action="">
                <div class="order-step-mainContent">
                    <div>
                        <label for="order-step-name">收货人姓名</label>
                        <input type="text" id="order-step-name">
                    </div>
                    <div>
                        <label for="order-step-phone">手机号码</label>
                        <input type="text" id="order-step-phone">
                    </div>
                    <div class="d-flex address">
                        <label for>所在地区</label>
                        <div>
                            <select id="province" onchange="chooseProvince(this)">
                                <option value="1">请选择省</option>
                            </select>
                            <select id="city" onchange="chooseCity(this)">
                                <option value="2">请选择市</option>
                            </select>
                            <select id="area">
                                <option value="3">请选择区</option>
                            </select>
                        </div>
                    </div>
                    <div class="">
                        <label for="order-step-detailedAddress">详细地址</label>
                        <input type="text" id="order-step-detailedAddress">
                    </div>
                </div>
            </form>
            <div class="order-step-tit mt-2 mb-4">商品清单</div>
            <div class="order-list">
                <div class="order-list-tit d-flex">
                    <div class="col-6">商品详细</div>
                    <div class="col-2  text-center">尺码</div>
                    <div class="col-2  text-center">单价</div>
                    <div class="col-2  text-center">数量</div>
                </div>
                <div id="items-list">
                </div>
                <div class="order-list-footer d-flex justify-content-between">
                    <div class="order-list-footer-oid">
                        订单编号：
                    </div>
                    <div class="d-flex">
                        <div class="price-sum py-1">
                            总价
                            <em>￥0</em>
                        </div>
                        <div class="btn-area text-center" id="payment">
                            去支付
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- 版心元素结束 -->
    <div style="height: 500px;"></div>
</body>
<script src="js/order.js"></script>
</html>